<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>test column</title>

<style type="text/css"> 
  *{padding: 0;margin:0;}

#container2 {

 float: left;

 width: 100%;

 background: orange;

 position: relative;

 overflow: hidden;

 }

 #container1 {

 float: left;

 width: 100%;

 background: green;

 position: relative;

 left: 220px;/* 宽度大小等与边栏宽度大小*/

 }

     

 #col2 {

 position: relative;

 margin-right: 220px;/* 宽度大小等与边栏宽度大小*/

 }

     

 #col1 {

 width: 220px;

 float: left;

 position: relative;

 margin-left: -220px;/* 宽度大小等与边栏宽度大小*/

 }

  

#col1,#col2 {

min-height: 200px;

height: auto !important;

height: 200px;

}
</style>
</head>
<body>
<div id="container2">

	<div id="container1">

		<div id="col1">Left Sidebar</div>

		<div id="col2">Main Content</div>

	</div>

</div>

	<script type="text/javascript">
			
	</script>
</body>
</html>